<template>
	<image @tap="$emit('click')" :src="src" :mode="mode" :style="{display:'block','width':$u.addUnit(width),'height':$u.addUnit(height),'border-radius':$u.addUnit(borderRadius),'margin-top':$u.addUnit(marginTop),'margin-right':alignCenter?'auto':$u.addUnit(marginRight),'margin-bottom':$u.addUnit(marginBottom),'margin-left':alignCenter?'auto':$u.addUnit(marginLeft)}"></image>
</template>

<script>
	export default {
		name:'StaticImage',
		props:{
			src:{
				type:String,
				default:''
			},
			width:{
				type:[String, Number],
				default:'50'
			},
			height:{
				type:[String, Number],
				default:'50'
			},
			borderRadius:{
				type:[String, Number],
				default:'0'
			},
			alignCenter:{
				type:Boolean,
				default:false
			},
			marginTop:{
				type:[String, Number],
				default:'0'
			},
			marginRight:{
				type:[String, Number],
				default:'0'
			},
			marginBottom:{
				type:[String, Number],
				default:'0'
			},
			marginLeft:{
				type:[String, Number],
				default:'0'
			},
			mode:{
				type:String,
				default:''
			}
		}
	}
</script>
